<!DOCTYPE html>
<html>
<head>
    <title>Add Student</title>
    <script type="text/javascript" src="/static/js/jquery-3.2.1.js"></script>
    <script type="text/javascript" src="/static/js/jquery-3.2.1.min.js"></script>
</head>
<body>
    <h1>Add Student</h1>
    <form id="addStudentForm">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name" required><br>
        <label for="grade">Grade:</label>
        <input type="text" id="grade" name="grade" required><br>
        <input type="submit" value="Add">
    </form>
    <script>
        $("#addStudentForm").on("submit", function(e) {
            e.preventDefault(); //阻止表单默认提交行为
            var formData = $(this).serialize();
            $.ajax({
                url: '/add_student',
                type: "POST",
                data: formData,
                success: function(response) {
                    alert(response.msg);
                    window.location.href = '/shouye/';
                },
                error: function(response) {
                    alert("Error: " + response.msg);
                }
            });
        }); 

    </script>
</body>
</html>